import {PageContainer} from "@ant-design/pro-layout";
import ProTable from '@ant-design/pro-table';
import {CloseOutlined,CheckOutlined} from '@ant-design/icons';
import {userCoupon} from "@/services/ant-design-pro/marketing";

const Record = () => {
  const columns = [
    {
      title: 'ID',
      dataIndex: 'cid',
      width: 100,
      align: 'center',
      search: false
    },
    {
      title: '优惠券名称',
      dataIndex: 'coupon_title',
      align: 'center',
    },
    {
      title: '领取人',
      dataIndex: 'name',
      align: 'center',
      filters: true,
      onFilter: true,
      render:(_,record)=>{
        return <span>{record.user.nickname}</span>
      }
    },
    {
      title: '面值',
      dataIndex: 'coupon_price',
      align: 'center',
      search: false
    },
    {
      title: '最低消费额',
      dataIndex: 'use_min_price',
      align: 'center',
      search: false
    },
    {
      title: '开始使用时间',
      dataIndex: 'add_time',
      valueType: 'dateTime',
      search: false,
      align: 'center',
    },
    {
      title: '结束使用时间',
      dataIndex: 'end_time',
      valueType: 'dateTime',
      align: 'center',
      search: false
    },
    {
      title: '获取方式',
      dataIndex: 'type',
      align: 'center',
      search: false,
      render:(_,record)=>{
        if (record.type === 0){
          return <span>后台发放</span>
        }
        return <span>前台手动领取</span>
      }
    },
    {
      title: '是否可用',
      dataIndex: 'is_fail',
      align: 'center',
      search: false,
      render: (_,record)=>{
        if (record.is_fail === 0){
          return <CloseOutlined style={{color: 'red'}}/>
        }
        return <CheckOutlined style={{color: 'blue'}}/>
      }
    },
    {
      title: '状态',
      dataIndex: 'status',
      align: 'center',
      fixed: 'right',
      valueType: 'select',
      valueEnum: {
        status_one: '未使用',
        status_two: '已使用',
        status_three: '已过期'
      },
    },
  ];

  return (
    <PageContainer
      header={{
        title: '会员领去记录',
        breadcrumb: {},
      }}
    >
      <ProTable

        columns={columns}
        request={async (params={}) => {
          let {data,meta} =  await userCoupon({...params})
          return{
            data,
            success:true,
            total:meta.pagination.total
          }
        }}
        editable={{
          type: 'multiple',
        }}
        rowKey="id"
        search={{
          labelWidth: 'auto',
        }}
        scroll={{ x: 1300 }}
        form={{
          // 由于配置了 transform，提交的参与与定义的不同这里需要转化一下
          syncToUrl: (values, type) => {
            if (type === 'get') {
              return {
                ...values,
                created_at: [values.startTime, values.endTime],
              };
            }
            return values;
          },
        }}
        pagination={{
          pageSize: 5,
        }}
        dateFormatter="string"
      />
    </PageContainer>

  );
};

export default Record;
